<template>
  <tr >
    <td>{{bookData.id}}</td>
    <td>{{bookData.name}}</td>
    <td>{{bookData.date | formDate}}</td>
    <td>
        <button :disabled="isDel" @click="onDel(bookData.id)">删除</button>
        <button :disabled="flag" @click="onEdit(bookData.id)" >编辑</button>
    </td>
  </tr>
</template>

<script>
import moment from 'moment'
export default {
  data () {
    return {

    }
  },
  filters: {
    formDate (val) {
      return moment(val).format('YYYY-MM-DD') // 时间戳格式转换
    }
  },
  props: {
    bookData: { // 接收父组件对象信息
      type: Object,
      require: true
    },
    isDel: { // 判断删除按钮是否禁用
      type: Boolean,
      require: true
    },
    flag: { // 判断编辑按钮是否禁用
      type: Boolean,
      require: true
    }
  },
  created () {

  },

  methods: {
    onEdit (id, name) { // 点击编辑时，将当前id传给父组件
      this.$emit('on-edit', id)
    },
    onDel (id) { // 点击删除时，将当前id传给父组件
      this.$emit('on-del', id)
    }
  }
}
</script>

<style scoped lang='less'>

</style>
